import { createRouter, createWebHashHistory } from 'vue-router'
//constantRouters 为静态路由不参与路由权限拦截，因此不做权限控制
import Layout from '@/layout/index.vue'
export const constantRoutes = [
  {
    path: '/',
    component: Layout,
    name: 'Index',
    redirect: '/dashboard',
    children: [
      {
        path: 'dashboard',
        name: 'Dashboard',
        component: () => import('@/views/dashboard/index.vue'),
        meta: { title: 'Dashboard' }
      }
    ]
  },
  {
    path: '/login',
    name: 'Login',
    component: () => import('@/views/login/index.vue'),
    hidden: true
  },

  {
    path: '/404',
    name: '404Page',
    component: () => import('@/views/error-page/404.vue'),
    hidden: true
  },
  {
    path: '/401',
    name: '401Page',
    component: () => import('@/views/error-page/401.vue'),
    hidden: true
  },
  {
    path: '/keep-alive',
    component: Layout,
    name: 'keepAlive',
    meta: { title: 'Tab KeepAlive' },
    children: [
      {
        path: '/second-keep-alive',
        component: () => import('@/views/basic-demo/keep-alive/index.vue'),
        name: 'SecondKeepAlive',
        //cachePage: cachePage when page enter, default false
        //leaveRmCachePage: remove cachePage when page leave, default false
        meta: { title: 'Second KeepAlive', cachePage: true, leaveRmCachePage: false }
      },
      {
        path: '/second-child',
        name: 'SecondChild',
        hidden: true,
        component: () => import('@/views/basic-demo/keep-alive/second-child.vue'),
        meta: { title: 'SecondChild', cachePage: false, activeMenu: '/basic-demo/second-keep-alive' }
      },
      {
        path: 'third-child',
        name: 'ThirdChild',
        hidden: true,
        component: () => import('@/views/basic-demo/keep-alive/third-child.vue'),
        meta: { title: 'ThirdChild', cachePage: false, activeMenu: '/basic-demo/second-keep-alive' }
      },
      //tab-keep-alive
      {
        path: 'tab-keep-alive',
        component: () => import('@/views/basic-demo/keep-alive/tab-keep-alive.vue'),
        name: 'TabKeepAlive',
        //closeTabRmCache: remove cachePage when tabs close, default false
        meta: { title: 'Tab KeepAlive', cachePage: false, closeTabRmCache: true }
      },
      //third-keep-alive
      {
        path: 'third-keep-alive',
        name: 'ThirdKeepAlive',
        component: () => import('@/views/basic-demo/keep-alive/third-keep-alive.vue'),
        //注：移除父容器页面缓存会把子页面一起移除了
        meta: { title: 'Third KeepAlive', cachePage: true, leaveRmCachePage: true },
        alwaysShow: true,
        children: [
          {
            path: 'second-children',
            name: 'SecondChildren',
            component: () => import('@/views/basic-demo/keep-alive/third-children/SecondChildren.vue'),
            meta: { title: 'SecondChild', cachePage: true, leaveRmCachePage: false }
          },
          {
            path: 'third-children',
            name: 'ThirdChildren',
            component: () => import('@/views/basic-demo/keep-alive/third-children/ThirdChildren.vue'),
            meta: { title: 'ThirdChildren', cachePage: true, leaveRmCachePage: false }
          }
        ]
      }
    ]
  }
]

//角色和code数组动态路由
export const roleCodeRoutes = [
  {
    path: '/roles-codes',
    component: Layout,
    redirect: '/roles-codes/page',
    alwaysShow: true, // will always show the root menu
    name: 'Permission',
    meta: {
      title: 'Permission',
      icon: 'lock',
      roles: ['admin', 'editor'] // you can set roles in root nav
    },
    children: [
      {
        path: 'index',
        component: () => import('@/views/roles-codes/index.vue'),
        name: 'RolesCodes',
        meta: {
          title: 'index',
          roles: ['admin']
        }
      },
      {
        path: 'roleIndex',
        component: () => import('@/views/roles-codes/role-index.vue'),
        name: 'RoleIndex',
        meta: {
          title: 'Role Index',
          roles: ['editor']
        }
      },
      {
        path: 'code-index',
        component: () => import('@/views/roles-codes/code-index.vue'),
        name: 'CodeIndex',
        meta: {
          title: 'Code Index',
          code: 16
        }
      },
      {
        path: 'button-permission',
        component: () => import('@/views/roles-codes/button-permission.vue'),
        name: 'ButtonPermission',
        meta: {
          title: 'Button Permission'
        }
      }
    ]
  }
]

export const asyncRoutes = [{ path: '/:catchAll(.*)', name: 'CatchAll', redirect: '/404', hidden: true }]
const router = createRouter({
  //createWebHashHistory 采用路由hash模式#
  history: createWebHashHistory(),
  //每次进入页面将页面重置到顶部
  scrollBehavior: () => ({ top: 0 }),
  //将静态路由注册到路由上
  routes: constantRoutes
})

export default router
